<!DOCTYPE html>
<style>
.clone {
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.border {
  border-left: solid 10px orange;
  border-right: solid 20px purple
}
.padding {
  padding-left: 10px;
  padding-right: 20px;
}
div {
  border: 5px solid blue;
}
.min {
  width: min-content;
}
.max {
  width: max-content;
}
</style>
<body>
  <div class="min">
    <span class="clone border">
      line1 line2 line3
    </span>
  </div>
  <div class="min">
    <span class="clone padding">
      line1 line2 line3
    </span>
  </div>
  <div class="max">
    <span class="clone border">
      line1 line2 line3
    </span>
  </div>
  <div class="max">
    <span class="clone border">
      line1 line2<br>line3
    </span>
  </div>
</body>
